import React, { useContext } from 'react'
import { Context } from './App'

/* export default function Child({ count, changeCount }) {
  // !#3 通过 Context.Consumer 消费数据
  return (
    <Context.Consumer>
      {(value) => (
        <div>
          <h3>Child: {value.count}</h3>
          <button onClick={value.changeCount}>修改爷爷的count</button>
        </div>
      )}
    </Context.Consumer>
  )
} */

export default function Child({ count, changeCount }) {
  // !#3 通过 useContext 传递 Context 拿到数据
  // 返回值就是传递过来的数据
  const value = useContext(Context)
  return (
    <div>
      <h3>Child: {value.count}</h3>
      <button onClick={value.changeCount}>修改爷爷的count</button>
    </div>
  )
}
